<template>
  <!-- Join class -->
  <svg v-if="name === 'join-class'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M12 4L12 20" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
    <path d="M4 12L20 12" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- Notes -->
  <svg v-if="name === 'notes'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M4 4h16v16H4z" stroke="currentColor" stroke-width="2"/>
    <path d="M8 8h8M8 12h8M8 16h4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- Flashcards -->
  <svg v-if="name === 'flashcards'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <rect x="4" y="4" width="16" height="16" rx="2" stroke="currentColor" stroke-width="2"/>
    <path d="M12 8v8M8 12h8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- AI Tools -->
  <svg v-if="name === 'ai-tools'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  </svg>

  <!-- Video -->
  <svg v-if="name === 'video'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <rect x="2" y="4" width="20" height="16" rx="2" stroke="currentColor" stroke-width="2"/>
    <path d="M10 8l6 4-6 4V8z" fill="currentColor"/>
  </svg>

  <!-- Lecture -->
  <svg v-if="name === 'lecture'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M2 3h20v18H2z" stroke="currentColor" stroke-width="2"/>
    <path d="M6 8h12M6 12h12M6 16h8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- PDF -->
  <svg v-if="name === 'pdf'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M4 4v16h16V8l-4-4H4z" stroke="currentColor" stroke-width="2"/>
    <path d="M14 4v4h4" stroke="currentColor" stroke-width="2"/>
  </svg>

  <!-- PPT -->
  <svg v-if="name === 'ppt'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <rect x="2" y="4" width="20" height="16" rx="2" stroke="currentColor" stroke-width="2"/>
    <path d="M8 8h8M8 12h8M8 16h4" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- Quizlet -->
  <svg v-if="name === 'quizlet'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M4 4h16v16H4z" stroke="currentColor" stroke-width="2"/>
    <path d="M8 12h8M8 8h8M8 16h8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>

  <!-- Import -->
  <svg v-if="name === 'import'" width="24" height="24" viewBox="0 0 24 24" fill="none">
    <path d="M12 3v13M5 10l7 7 7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
    <path d="M4 20h16" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
  </svg>
</template>

<script setup lang="ts">
defineProps<{
  name: string
}>()
</script> 